<template>
  <view>
    <block v-if="modal == true ? 'show' : ''">
      <view class="login-bg"></view>
      <view class="login-box">
        <view class="login-title">你还没登录</view>
<!--        <text>请选择以下任一登录方式</text> -->
        <text>登录后再进行操作</text>

        <!-- <image src="/static/login.png" mode="widthFix"></image> -->
        <!-- #ifdef MP-WEIXIN -->
        <view class="login-btnbox">
          <button
            class="login-btn"
            hover-class="none"
            @click="getUserInfo"
            style="background-color: #09ba07; color: #fff"
          >
            微信登录
          </button>
		  <!-- <button class='bottom' type='primary' open-type="getUserInfo" withCredentials="true" lang="zh_CN" @click="getUserInfo">微信登录</button> -->
         <!-- <button
            class="login-btn"
            hover-class="none"
            @click="goLogin"
            style="background-color: #5677fc; color: #fff"
          >
            账号登录
          </button> -->
        </view>
        <!-- #endif -->

        <!-- #ifndef MP-WEIXIN -->
       <!-- <view class="login-btnbox" v-if="showRegBtn">
          <view
            class="login-btn"
            @click="goLogin"
            style="
              color: #333;
              background-color: #5677fc;
              color: #fff;
              width: 88%;
            "
            >账号登录</view
          >
        </view> -->
        <!-- #endif -->
        <!-- <view class="login-btnbox">
          <view
            class="login-btn"
            @click="hideModal"
            style="color: #333; background-color: #f1f1f1; width: 88%"
            >暂不登录
          </view>
        </view> -->
      </view>
    </block>

    <wx-user-info-modal
      v-model="showAuthorizationModal"
      @updated="updatedUserInfoEvent"
    ></wx-user-info-modal>
    <kz-wx-privacy-check ref="kzWxPrivacyCheck"></kz-wx-privacy-check>
  </view>
</template>

<script>
import { setUserInfo ,reqLogin} from "@/api/index.js"
import WxUserInfoModal from "@/uni_modules/tuniaoui-wx-user-info/components/tuniaoui-wx-user-info/tuniaoui-wx-user-info.vue";
import kzWxPrivacyCheck from "@/components/kz-wx-privacy-check/kz-wx-privacy-check.vue"
import store from "@/store"
export default {
  name: "login",
  components: { WxUserInfoModal , kzWxPrivacyCheck },
  props: {
    show: {
      default: true,
    },
    pid: {
      default: 0,
    },
  },
  data() {
    return {
      modal: false,
      showAuthorizationModal: false,
      afterMethod: null,
      // system: null,
      showRegBtn: true,
    };
  },
  mounted() {
    if (this.show && !uni.getStorageSync("user")) {
      this.modal = true;
    }
	
	// 获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面
	// const pages = getCurrentPages();
	// 获取到当前页面的路径和参数
	// const loginJumpPage = pages[pages.length - 1].$page.fullPath; //完整路由地址
	// this.utils.setData('loginJumpPage', loginJumpPage)
	// console.log('login first page', loginJumpPage)

    // let system = uni.getStorageSync("system");
    // if (
    //   system &&
    //   system.open_user_register != undefined &&
    //   parseInt(system.open_user_register) === 0
    // ) {
    //   this.showRegBtn = false;
    // }
  },
  methods: {
	  getUserInfo() {
		var that = this;
	  	uni.getUserProfile({
	  		lang: 'zh_CN',
	  		desc: '登录',
	  		success: infoRes => {
	  			this.userInfo=infoRes.userInfo; //用户信息，微信头像，昵称等等
				let obj = {
					nickName:this.userInfo.nickName,
					avatarUrl:this.userInfo.avatarUrl,
					gender:this.userInfo.gender
				}
				uni.login({
	  				success(res){
	  					// console.log(res.code)  //获取到的code
						// store.dispatch('user/getLogin',{code:res.code,userInfo:arr})
						console.log(res.code,obj);
						that.wxlogin(res.code,obj)
	  				}
	  			})			
	  		},
	  		fail(res) {
	  			uni.showToast({
	  				title:'登录授权失败',
	  				icon:'none',
	  			})
	  		}
	  	});
	  },
    wxlogin(code, userInfo) {
		uni.showLoading({
			title: '登录中'
		});
      let that = this;
      reqLogin({code:code, nickName:userInfo.nickName, avatarUrl:userInfo.avatarUrl, gender:userInfo.gender}).then((res) => {
        if (res.data.code == 0) {
          uni.showModal({
            content: "请求失败：" + res.data.msg,
            showCancel: false,
            success: function () {
              if (callBack != undefined) {
                callBack();
              }
            },
          });
          uni.$emit("login_fail", "请求失败：" + res.data.msg);
        } else {
          // if (res.data.data.user.status == "hidden") {
          //   uni.showModal({
          //     content: "账号已被禁用，请联系管理员重新开启！",
          //     showCancel: false,
          //     success: function () {
          //       if (callBack != undefined) {
          //         callBack();
          //       }
          //     },
          //   });
          //   uni.$emit("login_fail", "账号已被禁用，请联系管理员重新开启！");
          // } else {
            uni.setStorageSync("token", res.data.data.token);
            uni.setStorageSync("user", res.data.data.user);
            // uni.$emit("login_success", res.data.data);

            this.modal = false;
            // 登录后执行之前的操作
            if (this.afterMethod) {
              this.afterMethod();

              // 置空
              this.afterMethod = null;
            }
            if (res.data.data.user.nickname == "微信用户") {
              this.showAuthorizationModal = true;
            }
			uni.hideLoading();
			uni.showToast({
				title: '登录成功',
			 })
            this.$emit("succ", res.data.data);
          // }
        }
      });
    },
    // hideModal(e) {
    //   this.modal = false;
    // },
    // 获取到的用户信息
    async updatedUserInfoEvent(info) {
      let data = {
        nickname: info.nickname,
		avatar:info.avatar,
		mobile:info.mobile
      };

	  const  res = await setUserInfo(data);
	  if(res.data.code == 1){
	  	uni.setStorageSync('user', res.data.data.user)
		this.showAuthorizationModal = false;
	  	uni.showToast({
	  		title:'保存成功！',
	  		icon:'success',
	  	})
		 this.$emit("succ", res.data.data);
	  }
    },
  }
};
</script>

<style>
.login-bg {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 990;
}

.login-box {
  width: 80%;
  height: auto;
  background-color: #ffffff;
  border-radius: 16rpx;
  box-sizing: border-box;
  padding: 50rpx 30rpx;
  text-align: center;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 991;
}

.login-title {
  font-weight: 500;
  color: #000000;
  padding-bottom: 10rpx;
  font-size: 16px;
}

.login-box > text {
  color: #999999;
  font-size: 28rpx;
  display: block;
}

.login-box > image {
  width: 80%;
  height: auto;
  margin: 20rpx 0 50rpx;
}

.login-btnbox {
  height: 100rpx;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

button,
button::after {
  margin: 0;
  padding: 0;
  border: none;
  outline: none;
  border-radius: 0;
}

.login-btn,
button.login-btn {
  width: 200rpx;
  height: 80rpx;
  line-height: 80rpx;
  text-align: center;
  border-radius: 8rpx;
  color: #ffffff;
  font-size: 28rpx;
}

.login-page {
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 授权按钮 */
.submit-btn {
  width: 100%;
  background-color: #05c160;
  color: #ffffff;
  margin-top: 60rpx;
  border-radius: 10rpx;
  padding: 25rpx;
  font-size: 32rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 30rpx;
}
</style>
